<script setup>
import {ref,onMounted} from "vue"
import animeModel3 from "../components/animeModel3.vue"
import axios from "axios"

import gdyg_tj from "../../public/images/anime/gdyg_tj.jpg"
import mygo_tj from "../../public/images/anime/mygo_tj.jpg"
import blzh_tj from "../../public/images/anime/blzh_tj.jpg"
import zsdfll_tj from "../../public/images/anime/zsdfll_tj.jpg"
import ywsndnn_tj from "../../public/images/anime/ywsndnn_tj.jpg"

const localhost = "localhost"
const port = 8088

const animeGDYGVideoUrl = ref("")
const animeMYGOVideoUrl = ref("")
const animeBLZHVideoUrl = ref("")
const animeZSDFLLVideoUrl = ref("")
const animeYWSNDNNVideoUrl = ref("")

onMounted(()=>{
    document.title = "全部番剧 - EvenSO"
})

axios.get(`http://${localhost}:${port}/anime/gdyg`).then(async res=>{
    animeGDYGVideoUrl.value = await res.data[0].anime_msg[0].fan_player
})
axios.get(`http://${localhost}:${port}/anime/mygo`).then(async res=>{
    animeMYGOVideoUrl.value = await res.data[0].anime_msg[0].fan_player
})
axios.get(`http://${localhost}:${port}/anime/blzh`).then(async res =>{
    animeBLZHVideoUrl.value = await res.data[0].anime_msg[0].fan_player
})
axios.get(`http://${localhost}:${port}/anime/zsdfll`).then(async res =>{
    animeZSDFLLVideoUrl.value = await res.data[0].anime_msg[0].fan_player
})
axios.get(`http://${localhost}:${port}/anime/ywsndnn`).then(async res =>{
    animeYWSNDNNVideoUrl.value = await res.data[0].anime_msg[0].fan_player
})

</script>

<template>
    <div class="allVideoAll">
        <div class="dialogBoxColor"></div>
        <div class="fan1">
            <!-- <img src="" alt=""> -->
            <animeModel3 
                :imageUrl="gdyg_tj" 
                :videoUrl="animeGDYGVideoUrl" 
                :isPlay="false"
                goToWhere="gdyg/1"/>
            <animeModel3 
                :imageUrl="mygo_tj" 
                :videoUrl="animeMYGOVideoUrl" 
                :isPlay="false"
                goToWhere="mygo/1"/>
            <animeModel3 
                :imageUrl="blzh_tj" 
                :videoUrl="animeBLZHVideoUrl" 
                :isPlay="false"
                goToWhere="blzh/1"/>
            <animeModel3 
                :imageUrl="zsdfll_tj" 
                :videoUrl="animeZSDFLLVideoUrl" 
                :isPlay="false"
                goToWhere="zsdfll/1"/>
        </div>
        <div class="fan1">
            <animeModel3 
                :imageUrl="ywsndnn_tj" 
                :videoUrl="animeYWSNDNNVideoUrl" 
                :isPlay="false"
                goToWhere="ywsndnn/1"/>
        </div>
    </div>
</template>

<style scoped>
.allVideoAll{
    position: absolute;
    left: 0;
    top: 0;
    width: 1872px;
    height: 100%;
    /* background-color: red; */
    /* overflow: hidden; */
}
.dialogBoxColor{
    width: 100%;
    height: 6%;
    background: rgba(100, 200, 200, 1);
}
.fan1{
    width: 100%;
    height: 30%;
    display: flex;
    align-items: center;
    background-color: skyblue;
}
</style>